<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>03_计算器练习</title>
</head>
<body>
  <input type="text" placeholder="请输入数字" id="i1"> <br>
  <input type="text" placeholder="请输入数字" id="i2"> <br>
  <button onclick="calc('+')">+</button>
  <button onclick="calc('-')">-</button>
  <button onclick="calc('*')">*</button>
  <button onclick="calc('/')">/</button>
  <p4>运算结果：<span></span></p4>
  <script>
    function calc(o){
      let n1 = document.querySelector('#i1').value;
      let n2 = document.querySelector('#i2').value;
      let res = 0;
      switch(o){
        case '+':
          res = Number(n1) + Number(n2);
          break;
        case '-':
          res = Number(n1) - Number(n2);
          break;
        case '*':
          res = Number(n1) * Number(n2);
          break;
        case '/':
          if (n2 != 0){
            res = Number(n1) / Number(n2);
          } else{
            alert('除数不能为0');
          }
          break;
      }
      document.querySelector('span').innerHTML = res;
    }
  </script>
</body>
</html>
